@charset "utf-8";

/*rem转换函数(默认设置为40px)*/
	@function torem($px){
	    @return $px / 50px * 1rem;
	}

/*基础全局样式*/
    html{
        width: 100%;
        height: 100%;
        overflow-x: hidden;
    }
    body{
        font-family: Arial, Helvetica, sans-serif;
        font-size: torem(26px);
        color:#000;
        overflow: hidden;
    }
    a{
        color:#000;
        font-size:torem(16px);
        &:hover{
            color:orange;
        }
    }
    button{
        border: none;
    }
    img{
        vertical-align: top;
    }
    [v-cloak] {
        display: none;
      }

/*内容区布局*/
	.g-box{
        width: torem(750px);
        height: torem(3750px);
        background:#c84646 url(../image/bgt.jpg) no-repeat;
        background-size: contain;
        position: relative;
    }
    .g-bd{
       overflow: hidden;
       position: absolute;
       top:torem(656px);
       left:0;
        
       .h1-tit{
           width:torem(750px);
           height:torem(50px);
           background: url(../image/tit1.jpg) no-repeat;
           background-size: contain;
       }

        .m-hot{
            padding: 0 torem(22px);
            li{
                margin-bottom: torem(30px);
                border: torem(1px) solid #ccc;
                padding: torem(44px) torem(20px);
                background:#fff;
                border-radius: torem(10px);
            }
            img{
                width: torem(300px);
                background-size: contain;
            }
            .hot-text{
                width: torem(320px);
                margin: 0 torem(22px);
            }
            .u-tit{
                font-size: torem(30px);
                line-height: torem(40px);
                height: torem(120px);
                text-overflow: ellipsis;
                font-weight:normal;
            }
            .u-models{
                font-size: torem(22px);
                line-height: torem(44px);
                color:#7f7f7f;
            }
            .u-tags{
                span{
                    float: left;
                    padding:torem(4px);
                    border: torem(1px) solid #f00;
                    border-radius: torem(12px);
                    font-size: torem(18px);
                    text-align: center;
                    line-height: torem(26px);
                    margin-right: torem(18px);
                }
            }

            .u-price{
                line-height: torem(66px);
                font-size: torem(24px);
                color:#f00;
                span{
                    font-size: torem(30px);
                    font-weight: bold;
                    margin: 0 torem(5px);
                }
            }
            button{
                margin-top: torem(4px);
                width: torem(318px);
                height: torem(56px);
                background:#f00;
                font-size: torem(28px);
                color:#fff;
                text-align: center;
                line-height: torem(56px);
                border-radius: torem(10px);
            }
        }

        .m-you{
            // margin-top: torem(156px);
            padding: 0 torem(15px);
            li{
                float: left;
                margin: 0 torem(7px) torem(15px);
                padding: torem(26px) torem(16px) torem(32px) torem(16px);
                border: torem(1px) solid #7f7f7f;
                border-radius: torem(10px);
                background:#fff;
            }
            img{
                width: torem(192px);
                height: torem(192px);
            }
            .u-tit2{
                width: torem(192px);
                height: torem(72px);
                margin-top: torem(7px);
                font-size: torem(26px);
                font-weight: normal;
                line-height: torem(36px);
                text-overflow: ellipsis;
                overflow: hidden;
            }
            .u-price{
                font-size: torem(24px);
                line-height: torem(64px);
                color:#f00;
                span{
                    font-size: torem(32px);
                    font-weight: bold;
                    margin: 0 torem(5px);
                }
            }
            button{
                width: torem(192px);
                height: torem(58px);
                background:#f00;
                color:#fff;
                text-align: center;
                line-height: torem(58px);
                font-size: torem(28px);
                border-radius: torem(10px);
            }
        }

    }
    .g-ft{
        // position: absolute;
        // top:torem(2628px);
        // left:0;
        // width:torem(70px);
        // height: torem(48px);
        // background:url(../image/icon.png) no-repeat;
        // background-size: contain;
    }